import React, { useState, useEffect } from 'react';
import styles from './index.module.scss';
import RecommnetHead from './recomment-head';
import RecommentMain from './recomment-main';
import Button from '../button';

const Recomment = ({ type, data, style }) => {
  const [color, setColor] = useState();
  const [star, setStar] = useState(0);
  useEffect(() => {
    if (style) {
      setColor(style);
    } else {
      setColor(type);
    }
    setStar(data.star);
  }, []);
  return (
    <div className={styles.recomment}>
      <RecommnetHead
        type={type}
        content={data.type}
        img={data.img}
        star={star}
        color={color}
      >
        {data.name}
      </RecommnetHead>
      <RecommentMain data={data.context} />
      <div className={styles.bottom}>
        <Button
          type={'seeResult_' + color}
          onClick={() => window.location.href=data.url}
        >
          点击查看详情
        </Button>
      </div>
    </div>
  );
};

export default Recomment;
